﻿<template>
  <el-upload class="elm-upload-view" action="nothing" v-bind="$attrs" v-on="$listeners"
             :headers="{Authorization:authorization}"
             :data="{module_name:module_name, rel_id:rel_id}"
             :file-list="fileList" :on-success="success"
              :on-preview="preview" disabled>
    <div slot="tip" class="el-upload__tip" v-if="fileList.length>0 && tip!=' '">{{tip}}</div>
  </el-upload>

</template>

<script>
export default {
  data() {
    return {
      fileList: [],
      authorization:'Bearer '+elm.info.token
    }
  },
  mounted() {
    this.getFileList();
  },
  model: {
  },
  props: {
    rel_id: {
      type: String
    },
    module_name: {
      type: String,
      default: function () {
        return "";
      }
    },
    tip: {
      type: String,
      default: function () {
        return "相关附件";
      }
    },

  },
  watch: {
    module_name: {
      handler(value) {
        this.getFileList();
      }
    },
    rel_id: {
      handler(value) {
        this.getFileList();
      }
    }
  },
  methods: {
    async getFileList() {
      this.fileList = [];
      if(this.rel_id==null || this.module_name==null){
        return;
      }
      var res = await elm.post("/system/login/io/GetData", {module_name: this.module_name, rel_id: this.rel_id });
      for (var item of res) {
        this.fileList.push({ url: "/api/system/login/io/Viewer/" + item.id+"?token="+elm.info.token, name: item.origin_name, id: item.id});
      }
    },
    success(res, file, fileList) {
      this.fileList.push({ url: "/api/system/login/io/Viewer/" + res.id+"?token="+elm.info.token, name: res.origin_name, id: res.id });
    },
    preview(file) {
      if (file.status != "ready") {
        var element = document.createElement("a");
        element.href = file.url;
        element.target = "_blank"
        element.click();
      }
      else {
        this.$message.error('该文件暂未上传。');
      }
    },
  }
}
</script>

<style>
.elm-upload-view .el-upload
{
  display: none;
}
</style>